<template>
  <div v-loading="loading">
    <lab-design v-if="!loading"  :view.sync="viewInfo" :save-view="saveView" style="height: calc(100vh - 160px);width: 100%"></lab-design>
  </div>
</template>

<script>
export default {
  name: "ViewInfo",
  props: {
    viewId: {
      type: String,
      default: function () {
        return '0'
      }
    }
  },
  data () {
    return {
      viewInfo: {},
      loading: true
    }
  },
  mounted() {
    this.loadView()
  },
  methods: {
    loadView(){
      this.loading = true
      this.$get('view/get/' + this.viewId)
          .then(res => {
            this.$resultMsg(this, res, '视图加载异常', true)
            this.$Util.cleanObj(this, this.viewInfo)
            if (res.code === 200) {
              this.$Util.copyAttr(res.data, this.viewInfo, null, this)
            }
            setTimeout(() => {
              this.loading = false
            }, 200)
          })
    },
    saveView(viewModel){
      console.info('保存视图', viewModel, this.viewInfo)
      this.viewInfo.element = viewModel.element
      this.$post('/view/save', this.viewInfo)
          .then(res => {
            this.$resultMsg(this, res)
            if (res.code === 200) {
              this.$emit('save')
            }
          })
    }
  }
}
</script>

<style scoped>

</style>
